.swiper-slide {
	background-color: #FFFFFF;
}

.swiper-button-next,
.swiper-button-prev {
	background: none;
	color: #CCCCCC;
	margin-top: -30px;
	width: 60px !important;
	height: 60px !important;
	background-image: none !important;
    appearance: none;
    border: none;

	@include transition(300ms ease opacity);

	&:before {
		@extend .gm-icon-before;
		content: '\e800';
		font-size: 60px;
		margin: 0 !important;
        pointer-events: none;
	}

	&:hover {
		color: $brand-primary;
	}
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
	&:before {
		content: '\e820';
	}
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
	display: block !important;
	@include opacity (0);
}

// vertical slider navigation

.swiper-vertical {
	.swiper-button-next,
	.swiper-container-rtl .swiper-button-prev {
		bottom: 10px;
		margin-top: 0;
		left: 50%;
		margin-left: -30px;
		right: auto;
		top: auto;

		&:before {
			content: "\e81f";
		}
	}

	.swiper-button-prev,
	.swiper-container-rtl .swiper-button-next {
		top: 10px;
		margin-top: 0;
		left: 50%;
		margin-left: -30px;
		right: auto;
		bottom: auto;

		&:before {
			content: "\e801";
		}
	}
}

.swiper-is-not-active {
	& + div,
	& + div + div {
		display: none !important; // Hide swiper arrows when its not active.
	}
}

#slider_flyover_container {
	display: none;
	position: absolute;
	background-color: #FFFFFF;
	border-width: 1px;
	border-color: #CCCCCC;
	border-style: solid;
	padding: 10px;
	max-width: 800px;
	z-index: 200;
}